/**
 * @Author:  renyc
 * @Date: 2022年12月3日10:14:38
 */

import * as Cesium from "cesium/Cesium";
import * as echarts from 'echarts';

import Layer from "../layer/Layer";
import LayerType from "../layer/LayerType";
import DomUtil from "../utils/DomUtil";
import ChartType from "./ChartType";

/**
 * ECharts图层
 */
class ChartLayer extends Layer{

    constructor(name, options){
        super(name, options);

        this._options = options;
        this._type = LayerType.GEOJSON
        this._chartType = ChartType.NONE;
        
        this._container = this._createDomContainer(); 
        this._delegate = this._container;
        this._echarts = undefined;
    }

    /**
     * Chart的类型
     */
    get chartType(){
        return this._type;
    }

    /**
     * 设置ECharts的Options
     * 测试接口，正式发布不再使用
     * @param {} options 
     */
    setOptions(options){
        if(options&&this._echarts){
            this._options = options;
            this._echarts.setOption(this._options);
        }
    }

    /**
     * @description 图层渲染函数
     * @override
     */
    render(){}

    /**
     * 将Layer挂载到Viewer上(内部方法)
     * 由子类实现该函数
     * @protected
     * @Override 
     */
    _attach(){
        console.log("ChartLayer attach");

        this._initECharts();

        // let viewer = this._viewer;
        
        // this._container.style.width = viewer.scene.canvas.width + "px";
        // this._container.style.height = viewer.scene.canvas.height + "px";
        // let container = viewer.container;
        // viewer.container.appendChild(this._container);
        // viewer.scene.canvas.setAttribute('tabIndex', 0);

        // this._echarts = echarts.init(this._container);

        // this._echarts.setOption(this._options);
    }

    /**
     * 将Layer从Viewer上卸载(内部方法)
     * 由子类实现该函数
     * @protected
     * @Override 
     */
    _detach(){
        console.log("ChartLayer detach");

        if (this._delegate && this._viewer) {
            this._viewer.dcContainer.removeChild(this._delegate);
            this._echarts.dispose();
            //this._state = State.REMOVED
          }
    }

    _initECharts(){
        let viewer = this._viewer;
        
        this._container.style.width = viewer.scene.canvas.width + "px";
        this._container.style.height = viewer.scene.canvas.height + "px";
        let container = viewer.container;
        viewer.container.appendChild(this._container);
        viewer.scene.canvas.setAttribute('tabIndex', 0);

        this._echarts = echarts.init(this._container);

    }

    /**
     * 创建echarts的dom容器
     * @protected
     * @returns echarts的dom容器
     */
    _createDomContainer(){
        //let container = DomUtil.create('div', 'x-chart');
        let container = DomUtil.create('div');
        container.style.position = 'absolute';
        container.style.top = '0px';
        container.style.left = '0px';
        container.style.right = '0px';
        container.style.bottom = '0px';
        // container.style.width = scene.canvas.width + "px";
        // container.style.height = scene.canvas.height + "px";
        container.style.pointerEvents = "none";

        return container;
    }

}

export default ChartLayer
